/** @jsxImportSource @emotion/react */
import * as React from "react";
import {
  CCell, Cell, Table, TableBody, TableRow, Text, TableHead,
} from "customize-easy-ui-component";
import {DirectLink} from "../../routing/Link";
import {TailMenRowIspCheck} from "../contain/rarelyVary";

//无损检测人员资格
export const ProblemHandling= ({orc, rep} :{orc:any, rep:any}
) => {
  //const theme= useTheme();
  //两半各安显一排模式的用：const [renderRows,]=useRep2hTableViewer(config焊接资格, '附设表', orc,true,true,true);
  return <>
    <div css={{"@media print": {paddingBottom: '3.3rem', pageBreakInside: 'avoid'}} }>
      <Text id='ProblemHandle' variant="h2" css={{textAlign: 'center', marginTop: '1rem',
      }}>监检过程中发现问题的处理情况报告</Text>
      <div css={{display: 'flex', justifyContent: 'space-between'}}>
        <Text></Text>
        <Text>报告编号：{rep.isp.no}</Text>
      </div>
    </div>
    <Table fixed={ ["3.5%", "13%","%", "30%"] } css={{borderCollapse: 'collapse', "@media print": {marginTop: '-3.3rem'}}} tight  miniw={800}>
      <TableHead>
        <TableRow>
          <CCell><Text css={{fontSize:'0.65rem'}}>序号</Text></CCell><CCell><Text css={{fontSize:'0.8rem'}}>联络单/意见书编号</Text></CCell>
          <CCell>问题概述</CCell><CCell>处理情况</CCell>
        </TableRow>
      </TableHead>
      <TableBody>
        <DirectLink href={`/report/${rep?.modeltype}/ver/${rep?.modelversion}/${rep?.id}/ProblemHandle#ProblemHandle`}>
          { (orc?.问处表||[{}])?.map((o: any, i: number) => {
            if(!(orc?.问处表?.length>0))  return (<TableRow key={i}><CCell colSpan={4}>空表</CCell></TableRow>);
            return (
                <TableRow key={i}>
                  <CCell>{i+1}</CCell>
                  <CCell>{o.n}</CCell>
                  <Cell css={{whiteSpace:'pre-wrap'}}>{o.c}</Cell>
                  <Cell css={{whiteSpace:'pre-wrap'}}>{o.r}</Cell>
                </TableRow>
            );
          } ) }
        </DirectLink>
      </TableBody>
    </Table>
    <TailMenRowIspCheck orc={orc} rep={rep} cap={'监检员'} href={`/report/${rep?.modeltype}/ver/${rep?.modelversion}/${rep?.id}/ProjectList#ProjectList`}/>
  </>;
};

